<header data-am-widget="header" class="am-header am-header-default sq-head ">
	<div class="am-header-left am-header-nav">
		<a href="javascript:history.back()" class="">
			<i class="am-icon-chevron-left"></i>
		</a>
	</div>
	<h1 class="am-header-title">
		<a>绑定新手机号</a>
	</h1>
</header>
<form action="" class="layui-form">
	<div style="height: 49px;"></div>
	<div class="pay-iphone">请填写新手机号并进行验证</div>
	<div class="pay-box">
		<input type="text"  name="phone" placeholder="请输入新手机号"/>
		<input type="button" id="phoneCode" value="获取验证码" class="pay-box-btn"/>
	</div>
	<input type="text" placeholder="请输入验证码" name="phoneCode" class="login-password"/>
	<div class="yzm" style="margin-top: 1.5rem;">
		<img style="height: 50px;margin-left: 20px;width: 150px;" id="code" src="{:url('index/Reg/getCode')}" alt="">
		<input type="text" style="width: 200px" name="captcha" class="reg-yzm" placeholder="输入验证码"/>
	</div>
	<button class="login-btn" lay-submit lay-filter="sure">确认</button>
</form>
<div class="bound-text">
	<h2>手机绑定规则</h2>
	<p>1.一个手机号码只可以绑定一个账户；</p>
	<p>2.如果无法绑定手机，请联系客服协助解决。</p>
</div>

<script>
    layui.use('form', function () {
        var form = layui.form;
        $('#code').click(function () {
            $(this).attr('src', $(this).attr('src') + '?' + Math.random());
        });
        $('#phoneCode').click(function () {
            captcha = $(this).parent().siblings('div').find('input').val();
            console.log(captcha);
            if (captcha.length < 3 || captcha.length > 3) {
                layer.msg('请填写正确的验证码', function () {
                });
                return;
            }
            phone = $(this).siblings('input').val();
            if (phone.length < 11 || phone.length > 11) {
                layer.msg('请填写正确的手机格式', function () {
                });
                return;
            }
            $.post("{:url('index/Reg/phoneCode')}", {captcha: captcha, phone: phone}, function (res) {
                if (res.code == 0) {
                    layer.msg(res.msg, {icon: 9}, function () {
                    });
                } else {
                    layer.msg(res.msg, {icon: 1}, function () {
                        a = setInterval(run, 1000);
                    });
                }
            });
        })
        num = 58;
        function run() {
            num--;
            $('#phoneCode').attr('value', num + '秒后重新获取');
            if (num == 0) {
                num = 58;
                $('#phoneCode').attr('value', '重新获取');
                clearInterval(a);
            }

        }
        form.on('submit(sure)', function(data){
            console.log(data.field);
            $.post("{:url('index/SafetySet/editPhone')}",data.field, function(res) {
                if (res.code==1){
                    layer.alert(res.msg, {icon: 1},function (){
                        location.href=("{:url('index/My/index')}");
                    });
                }else{
                    $('#code').click();
                    layer.msg(res.msg, {icon: 9},function () {
                    });
                }
			});
            return false;
        });
    });
</script>
